<div class="page">
    <div class="page__hd">
        <h1 class="page__title">新年快乐</h1>
        <p class="page__desc">选择您所在的省，然后确定</p>
    </div>
    <div class="page__bd page__bd_spacing">
        <a href="javascript:;" class="weui-btn weui-btn_default" id="showPicker">各省发来贺电</a>
    </div>
    <audio id="myAudio0" class="weui-btn weui-btn_default" style="margin-top:10px;" controls controlsList="nodownload">
        <source src="./sound/horse.ogg" type="audio/ogg">
        <source src="http://www.w3school.com.cn/i/horse.mp3" type="audio/mp3">
        Your browser does not support the audio element.
    </audio>
    <audio id="myAudio1" class="weui-btn weui-btn_default" style="margin-top:10px;display:none;" controls controlsList="nodownload">
        <source src="./sound/song.ogg" type="audio/ogg">
        <source src="http://www.w3school.com.cn/i/song.mp3" type="audio/mp3">
        Your browser does not support the audio element.
    </audio>
</div>
<script type="text/javascript">
    var cityMap = {
        0: { "label":'北京', "audio":"http://www.w3school.com.cn/i/horse.ogg"},
        1: { "label":'山东', "audio":"http://www.w3school.com.cn/i/song.ogg"}
       // 2: { "label":'天津', "audio":"http://www.w3school.com.cn/i/horse.ogg"},
       // 3: { "label":'上海', "audio":"http://www.w3school.com.cn/i/song.ogg"},
       // 4: { "label":'湖北', "audio":"http://www.w3school.com.cn/i/horse.ogg"}
    };
    var originId = "myAudio0";
    $('#showPicker').on('click', function () {
        weui.picker([{
            label: '北京',
            value: 0
        }, {
            label: '山东',
            value: 1
        }], {
            onChange: function (result) {
                console.log(result);
            },
            onConfirm: function (result) {
                $('#showPicker').text(cityMap[result[0]].label);
                //$('#myAudio').attr('src', cityMap[result[0]].audio);
                $('#'+originId).hide();
                document.getElementById(originId).pause();
                var audioId = "myAudio" + result[0];
                originId = audioId;
                $('#'+audioId).show();
                document.getElementById(audioId).play();
                //document.getElementById('myAudio').src = cityMap[result[0]].audio;
                //document.getElementById('myAudio').play();
                //$('#myAudio').load();
                //console.log(result);
            }
        });
    });
</script>